<script setup>
    import {ref,onBeforeMount} from 'vue'
    import { GetmineCourseapi } from "../../http/api";
    import ItemBox from '../../components/Home/ItemBox.vue'
    const option1=ref([{text:'全部课程',value:0},{text:'付费课程',value:1},{text:'免费课程',value:2}])
    const option2=ref([{text:'全部状态',value:0},{text:'学习中',value:1},{text:'已完成',value:2},{text:'已过期',value:3},{text:'已隐藏',value:4}])
    const value1=ref(0)
    const value2=ref(0)
    const Course=ref([])
    onBeforeMount(()=>{
        GetmineCourseapi().then(res=>{
            console.log(res);
            Course.value=res.data.data
        })
    })

</script>
<template>
  <div>
    <!-- 444444 -->
    <div class="_all_course_head">
      <div class="_all_course_title">全部课程</div>
      <van-dropdown-menu active-color="#1989fa" class="list">
        <van-dropdown-item v-model="value1" :options="option1" />
        <van-dropdown-item v-model="value2" :options="option2" />
      </van-dropdown-menu>
    </div>
    <div class="_all_course_main">
    <item-box :data="Course"></item-box>

    </div>
  </div>
</template>
<style scoped>
._all_course_head {
  width: 100%;
  background-color: white;
  position: fixed;
  top: 0;
}
._all_course_main{
    margin-top: 230px;
}
.list{
    margin-top: 20px;
}
._all_course_title {
  width: 100%;
  height: 80px;
  text-align: center;
  line-height: 80px;
}
</style>
